<!--
 * @Author: CtrlC
 * @Date: 2022-07-26 17:00:38
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-07-10 15:28:12
 * @Description: file content
 * @FilePath: /vue3-uniapp-engineering/src/App.vue
-->
<script>
import { resetDailyData } from './utils/storage.js'

export default {
  globalData: {
    // 全局数据，可以在页面中通过 getApp().globalData 访问
    isDataInitialized: false
  },
  onLaunch() {
    console.log('App Launch')

    // 检查并重置每日数据
    this.checkAndResetDailyData()

    // 预加载音效资源
    this.preloadSounds()
  },
  onShow() {
    console.log('App Show')

    // 每次应用显示时检查是否需要重置数据
    // 这对于应用在后台运行了很长时间后重新打开的情况很有用
    this.checkAndResetDailyData()
  },
  onHide() {
    console.log('App Hide')
  },
  methods: {
    // 检查并重置每日数据
    checkAndResetDailyData() {
      // 调用 storage.js 中的重置函数
      resetDailyData()

      // 标记数据已初始化
      this.globalData.isDataInitialized = true
    },

    // 预加载音效资源
    preloadSounds() {
      try {
        // 创建音频上下文
        const waterSound = uni.createInnerAudioContext()
        // waterSound.src = '/static/sounds/water-drop.mp3'
        waterSound.autoplay = false

        // 预加载
        waterSound.onCanplay(() => {
          console.log('水滴音效预加载完成')
          // 停止音频，仅预加载不播放
          waterSound.stop()
        })
      } catch (error) {
        console.error('预加载音效失败:', error)
      }
    }
  }
}
</script>

<style lang="scss">
/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
@import 'uview-plus/index.scss';
/* 引入tailwindcss */
// @import 'tailwindcss/base';
// @import 'tailwindcss/utilities';

/* 全局样式 */
page {
  font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
  color: #333;
  font-size: 28rpx;
  line-height: 1.5;
  box-sizing: border-box;
}

/* 按钮样式重置 */
button {
  margin: 0;
  padding: 0;
  background-color: transparent;
  border-radius: 0;
  border: none;
  line-height: normal;
}

button::after {
  border: none;
}

/* 动画效果 */
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

.pulse-animation {
  animation: pulse 0.5s ease-in-out;
}
</style>
